<template>
	<div class="c1">
		<h1>我是Child1组件（哥哥）</h1>
		<h3>我自己有台电脑:{{computer}}</h3>
		<button @click="handleClick1">点我把电脑传给父</button> <br><br>
		<button @click="handleClick2">点我把手机传给父</button> <br><br>
		<button @click="handleClick3">点我解绑身上的send-computer自定义事件</button> <br><br>
		<button @click="handleClick4">点我解绑身上的所有自定义事件</button>
	</div>
</template>

<script>
	export default {
		name:'Child1',
		data() {
			return {
				a:2,
				computer:'联想电脑',
				mobile:'华为Mate40'
			}
		},
		methods: {
			handleClick1(){
				//触发Child1组件实例（vc）身上的send-computer事件
				this.$emit('send-computer',this.computer)
			},
			handleClick2(){
				//触发Child1组件实例（vc）身上的send-computer事件
				this.$emit('send-phone',this.mobile+Date.now())
			},
			handleClick3(){
				//解绑Child1组件实例（vc）身上的send-computer事件
				this.$off('send-computer')
			},
			handleClick4(){
				//解绑Child1组件实例（vc）身上所有的自定义事件
				this.$off()
			}
		},
	}
</script>

<style>
	.c1{
		background-color: orange;
		padding: 20px;
	}
</style>